<style lang="less" scoped>
    // @import './own-space.less';
    .ownspace{
        .form-con .ivu-form-item {
            margin-bottom: 24px !important;
        }
        .margin-top-8{
            margin-top: 8px;
        }
        .margin-top-10{
            margin-top: 10px;
        }
        .margin-top-20{
            margin-top: 20px;
        }
        .margin-left-10{
            margin-left: 10px;
        }
        .margin-bottom-10{
            margin-bottom: 10px;
        }
        .margin-bottom-100{
            margin-bottom: 100px;
        }
        .margin-right-10{
            margin-right: 10px;
        }
        .padding-left-6{
            padding-left: 6px;
        }
        .padding-left-8{
            padding-left: 5px;
        }
        .padding-left-10{
            padding-left: 10px;
        }
        .padding-left-20{
            padding-left: 20px;
        }
        .height-100{
            height: 100%;
        }
        .height-120px{
            height: 100px;
        }
        .height-200px{
            height: 200px;
        }
        .height-492px{
            height: 492px;
        }
        .height-460px{
            height: 460px;
        }
        .line-gray{
            height: 0;
            border-bottom: 2px solid #dcdcdc;
        }
        .notwrap{
            word-break:keep-all; 
            white-space:nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .padding-left-5{
            padding-left: 10px;
        }
        .openness-radio-con{
            margin-left: 5px;
            padding-left: 10px;
            height: 215px;
            border-left: 1px dashed #ebe9f3;
            overflow: hidden;
        }
        .Bank-radio-con{
            margin-left: 5px;
            padding-left: 10px;
            height: 265px;
            border-left: 1px dashed #ebe9f3;
            overflow: hidden;
        }
        .createBank-radio-con{
            margin-left: 5px;
            padding-left: 10px;
            height: 400px;
            border-left: 1px dashed #ebe9f3;
            overflow: hidden;
        }
        .Fund-radio-con{
            margin-left: 5px;
            padding-left: 10px;
            height: 124px;
            border-left: 1px dashed #ebe9f3;
            overflow: hidden;
            font-size: 12px;
        }
        .Fund-radio-con-s{
            margin-left: 5px;
            padding-left: 10px;
            height: 58px;
            border-left: 1px dashed #ebe9f3;
            overflow: hidden;
            font-size: 12px;
        }
        .article-link-con{
            height: 32px;
            width: 100%;
        }
        .fixed-link-enter{
            opacity: 0;
        }
        .fixed-link-enter-active, .fixed-link-leave-active {
            transition: opacity .3s
        }
        .fixed-link-enter-to{
            opacity: 1
        }
        .publish-time-picker-con{
            margin-left: 5px;
            padding-left: 10px;
            height: 100px;
            border-left: 1px dashed #ebe9f3;
            overflow: hidden;
        }
        .openness-con-enter{
            height: 0;
        }
        .openness-con-enter-active, .openness-con-leave-active{
            transition: height .3s;
        }
        .openness-con-enter-to{
            height: 215px;
        }
        .openness-con-leave{
            height: 215px;
        }
        .openness-con-leave-to{
            height: 0;
        }
    // 银行信息
        .Bank-con-enter{
            height: 0;
        }
        .Bank-con-enter-active, .Bank-con-leave-active{
            transition: height .3s;
        }
        .Bank-con-enter-to{
            height: 265px;
        }
        .Bank-con-leave{
            height: 265px;
        }
        .Bank-con-leave-to{
            height: 0;
        }

        // 创建银行信息
        .createBank-con-enter{
            height: 0;
        }
        .createBank-con-enter-active, .Bank-con-leave-active{
            transition: height .3s;
        }
        .createBank-con-enter-to{
            height: 400px;
        }
        .createBank-con-leave{
            height: 400px;
        }
        .createBank-con-leave-to{
            height: 0;
        }

        .publish-button-con{
            border-top: 1px solid #f3eff1;
            padding-top: 14px;
        }
        .publish-button{
            float: right;
            margin-left: 10px;
        }
        .publish-time-enter{
            height: 0;
        }
        .publish-time-enter-active, .publish-time-leave-active{
            transition: height .3s;
        }
        .publish-time-enter-to{
            height: 100px;
        }
        .publish-time-leave{
            height: 100px;
        }
        .publish-time-leave-to{
            height: 0;
        }
        .classification-con{
            height: 200px;
            margin-top: -16px;
            border-left: 1px solid #dddee1;
            border-right: 1px solid #dddee1;
            border-bottom: 1px solid #dddee1;
            border-radius: 0 0 3px 3px;
            padding: 10px;
            overflow: auto;
        }
        .add-new-tag-con{
            margin-top: 20px;
            border-top: 1px dashed #dbdddf;
            padding: 20px 0;
            height: 60px;
            overflow: hidden;
        }
        .add-new-tag-enter{
            height: 0;
            margin-top: 0;
            padding: 0px 0;
        }
        .add-new-tag-enter-active, .add-new-tag-leave-active{
            transition: all .3s;
        }
        .add-new-tag-enter-to{
            height: 60px;
            margin-top: 20px;
            padding: 20px 0;
        }
        .add-new-tag-leave{
            height: 60px;
            margin-top: 20px;
            padding: 20px 0;
        }
        .add-new-tag-leave-to{
            height: 0;
            margin-top: 0;
            padding: 0px 0;
            
        }
        .but-type{
            
            .ivu-btn{
                font-size: 18px;
            }
        }
        .input-300{
            width: 300px !important;
        }
    }
</style>

<template>
    <div class="ownspace">
        <Row>
            <Col span="24">
                <Card>
                    <p slot="title">
                        <Icon type="lightbulb"></Icon>
                        个人信息
                    </p>
                    <div class="edittable-test-con">
                        <p class="margin-top-10">
                            <Icon type="android-contact"></Icon>&nbsp;&nbsp;用户名：&nbsp;{{userData.name}}
                        </p>
                        <p class="margin-top-10" v-if="userBankInfo.id&&userData.group_level>1">
                            <Icon type="android-share-alt"></Icon>&nbsp;&nbsp;上级用户：&nbsp;{{userUP()}}
                        </p>
                        <p class="margin-top-10">
                            <Icon type="android-contacts"></Icon>&nbsp;&nbsp;用户组：&nbsp;<Tag>{{group.name}}</Tag>
                        </p>
                        <p class="margin-top-10">
                            <Icon type="social-yen"></Icon>&nbsp;&nbsp;账户资金：&nbsp;
                            <!-- <transition name="Bank-con"> -->
                                <div :class="userBankInfo.id&&userData.group_level>1?'Fund-radio-con':'Fund-radio-con-s'">
                                    <div class="margin-top-10">
                                        <p class="margin-top-10" v-if="userBankInfo.id&&userData.group_level>1">
                                            &nbsp;&nbsp;账户可用余额：&nbsp;<span style="color:rgb(57, 191, 102);">{{userInfo.Balance}}</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                            <ButtonGroup>
                                                <Button size="small" shape="circle" @click="refillModal" icon="card" type="ghost">充值</Button>
                                                <Button size="small" shape="circle" @click="withdrawals" icon="cash" type="ghost">提现</Button>
                                            </ButtonGroup>
                                        </p>
                                        <p class="margin-top-10" v-if="userBankInfo.id&&userData.group_level>1">
                                            &nbsp;&nbsp;账户欠款总额：&nbsp;<span style="color:rgb(57, 191, 102);">{{userInfo.AllUnPaid}}</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                        </p>
                                        <p class="margin-top-10">
                                            &nbsp;&nbsp;下级可用总余额：&nbsp;<span style="color:rgb(57, 191, 102);">{{userInfo.LowerSumBalance}}</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                        </p>
                                        <p class="margin-top-10">
                                            &nbsp;&nbsp;下级总欠款额度：&nbsp;<span style="color:rgb(57, 191, 102);">{{userInfo.LowerSumAllUnPaid}}</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                        </p>
                                    </div>
                                </div>
                            <!-- </transition> -->
                        </p>
                        <p class="margin-top-10" v-if="!userBankInfo.id">
                            <Icon type="ios-briefcase"></Icon>&nbsp;&nbsp;银行信息：&nbsp;
                            <Button v-show="!editBank" size="small" @click="handleEditBank" shape="circle" type="ghost">创建</Button>
                            <transition name="createBank-con">
                                <div v-show="editBank" class="createBank-radio-con">
                                    <div class="margin-top-10">
                                        <Form ref="createBankForm" :model="createBankForm" :label-width="90" label-position="left" :rules="validate">
                                            <FormItem label="银行名称:" prop="bankName" :error="oldCBankError">
                                                <!-- <Input v-model="editBankForm.oldPass" placeholder="请输入银行名称" ></Input> -->
                                                <AutoComplete
                                                    class="input-300"
                                                    ref="bankName"
                                                    v-model="createBankForm.bankName"
                                                    :data="data3"
                                                    @on-select="selectBank"
                                                    :filter-method="filterMethod"
                                                    placeholder="请输入银行名称">
                                                </AutoComplete>
                                            </FormItem>
                                            <FormItem label="银行账号:" prop="bankAccount">
                                                <Input class="input-300" v-model="createBankForm.bankAccount" placeholder="请输入银行账号" ></Input>
                                            </FormItem>
                                            <FormItem label="开户名:" prop="userName">
                                                <Input class="input-300" v-model="createBankForm.userName" placeholder="请输入开户名" ></Input>
                                            </FormItem>
                                            <Alert type="warning">
                                                温馨提示：您是第一次设置银行卡信息，为了您的资金安全，请输入资金密码，并牢记该密码！
                                            </Alert>
                                            <FormItem label="资金密码:" prop="fundPaw">
                                                <Input class="input-300" v-model="createBankForm.fundPaw" placeholder="请输入资金密码" ></Input>
                                            </FormItem>
                                            <FormItem label="确认资金密码:" prop="reFundPaw">
                                                <Input class="input-300" v-model="createBankForm.reFundPaw" placeholder="请再次输入资金密码" ></Input>
                                            </FormItem>
                                        </Form>                                    
                                    </div>
                                    <div style="text-align: center;" class="input-300">
                                        <Button type="primary" @click="saveCreateBank" size="small">确认创建</Button>
                                        <Button type="ghost" @click="cancelEditBank();czBank()" size="small">取消</Button>
                                    </div>
                                </div>
                            </transition>
                        </p>
                        <p class="margin-top-10" v-if="userBankInfo.id">
                            <Icon type="ios-briefcase"></Icon>&nbsp;&nbsp;银行信息：&nbsp;
                            <Button v-show="!editBank" size="small" @click="handleEditBank" shape="circle" type="ghost">修改</Button>
                            <transition name="Bank-con">
                                <div v-show="editBank" class="Bank-radio-con">
                                    <div class="margin-top-10">
                                        <Form ref="editBankForm" :model="editBankForm" :label-width="90" label-position="left" :rules="validate">
                                            <FormItem label="银行名称:" prop="bankName" :error="oldBankError">
                                                <!-- <Input v-model="editBankForm.oldPass" placeholder="请输入银行名称" ></Input> -->
                                                <AutoComplete
                                                    class="input-300"
                                                    ref="bankName2"
                                                    v-model="editBankForm.bankName"
                                                    :data="data3"
                                                    @on-select="selectBank2"
                                                    :filter-method="filterMethod"
                                                    placeholder="请输入银行名称">
                                                </AutoComplete>
                                            </FormItem>
                                            <FormItem label="银行账号:" prop="bankAccount">
                                                <Input class="input-300" v-model="editBankForm.bankAccount" placeholder="请输入银行账号" ></Input>
                                            </FormItem>
                                            <FormItem label="开户名:" prop="userName">
                                                <Input class="input-300" v-model="editBankForm.userName" placeholder="请输入开户名" ></Input>
                                            </FormItem>
                                            <FormItem label="资金密码:" prop="fundPaw">
                                                <Input class="input-300" v-model="editBankForm.fundPaw" placeholder="请输入资金密码" ></Input>
                                            </FormItem>
                                        </Form>                                    
                                    </div>
                                    <div style="text-align: center;" class="input-300">
                                        <Button type="primary" @click="saveEditBank" size="small">确认修改</Button>
                                        <Button type="ghost" @click="cancelEditBank" size="small">取消</Button>
                                    </div>
                                </div>
                            </transition>
                        </p>
                        <p class="margin-top-10">
                            <Icon type="lock-combination"></Icon>&nbsp;&nbsp;登录密码：&nbsp;
                            <Button v-show="!editLoginPaw" size="small" @click="handleEditLogin" shape="circle" type="ghost">修改</Button>
                            <transition name="openness-con">
                                <div v-show="editLoginPaw" class="openness-radio-con">
                                    <div class="margin-top-10">
                                        <Form ref="editLoginPawForm" :model="editLoginPawForm" :label-width="90" label-position="left" :rules="validate">
                                            <FormItem label="原密码:" prop="oldPass" :error="oldPassError">
                                                <Input class="input-300" v-model="editLoginPawForm.oldPass" placeholder="请输入原登录密码" ></Input>
                                            </FormItem>
                                            <FormItem label="新密码:" prop="newPass">
                                                <Input class="input-300" v-model="editLoginPawForm.newPass" placeholder="请输入新登录密码，至少6位字符" ></Input>
                                            </FormItem>
                                            <FormItem label="确认新密码:" prop="reLoginPass">
                                                <Input class="input-300" v-model="editLoginPawForm.reLoginPass" placeholder="请再次输入新登录密码" ></Input>
                                            </FormItem>
                                        </Form>                                    
                                    </div>
                                    <div style="text-align: center;" class="input-300">
                                        <Button type="primary" @click="saveEditLoginPass" size="small">确认修改</Button>
                                        <Button type="ghost" @click="cancelEditLogin" size="small">取消</Button>
                                    </div>
                                </div>
                            </transition>
                        </p>
                        <p class="margin-top-10" v-if="userBankInfo.id">
                            <Icon type="lock-combination"></Icon>&nbsp;&nbsp;资金密码：&nbsp;
                            <Button v-show="!editFundPaw" size="small" @click="handleEditFund" shape="circle" type="ghost">修改</Button>
                            <transition name="openness-con">
                                <div v-show="editFundPaw" class="openness-radio-con">
                                    <div class="margin-top-10">
                                        <Form ref="editFundPawForm" :model="editFundPawForm" :label-width="90" label-position="left" :rules="validate">
                                            <FormItem label="原密码:" prop="oldPass" :error="oldPassError">
                                                <Input class="input-300" v-model="editFundPawForm.oldPass" placeholder="请输入原资金密码" ></Input>
                                            </FormItem>
                                            <FormItem label="新密码:" prop="newPass">
                                                <Input class="input-300" v-model="editFundPawForm.newPass" placeholder="请输入新资金密码，至少6位字符" ></Input>
                                            </FormItem>
                                            <FormItem label="确认新密码:" prop="reFundPass">
                                                <Input class="input-300" v-model="editFundPawForm.reFundPass" placeholder="请再次输入新资金密码" ></Input>
                                            </FormItem>
                                        </Form>                                    
                                    </div>
                                    <div style="text-align: center;" class="input-300">
                                        <Button type="primary" @click="saveEditFundPass" size="small">确认修改</Button>
                                        <Button type="ghost" @click="cancelEditFund" size="small">取消</Button>
                                    </div>
                                </div>
                            </transition>
                        </p>
                        <div class="edittable-table-height-con">
                            <qr-code  ref="table2image"></qr-code>
                            <div style="text-align: center;"><Button type="info" @click="exportImage">下载二维码图片</Button></div>
                        </div>
                    </div>
                </Card>
            </Col>
        </Row>
        <Modal class="ref-modal" v-model="editRefillModal" :closable='false' :mask-closable=false :width="500">
            <h3 slot="header" style="color:#2D8CF0"><Icon type="card"></Icon>&nbsp;充值</h3>
            <Form ref="editRechargeForm" :model="editRechargeForm" :label-width="90" label-position="right">
                <FormItem label="银行名称：">
                    <Input v-model="userBankInfo.bank_name" disabled></Input>
                </FormItem>
                <FormItem label="开户姓名：">
                    <Input v-model="userBankInfo.bank_user_name" disabled></Input>
                </FormItem>
                <FormItem label="开户账号：">
                    <Input v-model="userBankInfo.bank_account" disabled></Input>
                </FormItem>
                <FormItem label="汇款金额：">
                    <Input number v-model="editRechargeForm.money"></Input>
                </FormItem>
            </Form>
            <div slot="footer">
                <Button type="text" @click="cancelRefill">取消</Button>
                <Button type="primary" @click="saveRecharge">确认充值</Button>
            </div>
        </Modal>
        <Modal class="ref-modal" v-model="editWithdrawalsModal" :closable='false' :mask-closable=false :width="500">
            <h3 slot="header" style="color:#2D8CF0"><Icon type="cash"></Icon>&nbsp;提现</h3>
            <Form ref="editWithdrawalsForm" :model="editWithdrawalsForm" :label-width="90" label-position="right">
                <FormItem label="银行名称：">
                    <Input v-model="userBankInfo.bank_name" disabled></Input>
                </FormItem>
                <FormItem label="开户姓名：">
                    <Input v-model="userBankInfo.bank_user_name" disabled></Input>
                </FormItem>
                <FormItem label="开户账号：">
                    <Input v-model="userBankInfo.bank_account" disabled></Input>
                </FormItem>
                <FormItem label="提现金额：">
                    <Input number v-model="editWithdrawalsForm.money"></Input>
                </FormItem>
            </Form>
            <div slot="footer">
                <Button type="text" @click="cancelWithdrawals">取消</Button>
                <Button type="primary" @click="saveWithdrawals">确认提现</Button>
            </div>
        </Modal>
    </div>
</template>

<script>
import html2canvas from 'html2canvas';
import qrCode from './qrcode.vue'
import { version } from 'punycode';
export default {
    name: 'ownspace_index',
    components: {
        qrCode
    },
    data () {
        const valideRePassword = (rule, value, callback) => {
            if (value !== this.editLoginPawForm.newPass) {
                callback(new Error('两次输入密码不一致'));
            } else {
                callback();
            }
        };
        const valideReFundPassword = (rule, value, callback) => {
            if (value !== this.editFundPawForm.newPass) {
                callback(new Error('两次输入密码不一致'));
            } else {
                callback();
            }
        };
        const valideCReFundPassword = (rule, value, callback) => {
            if (value !== this.createBankForm.fundPaw) {
                callback(new Error('两次输入密码不一致'));
            } else {
                callback();
            }
        };
        return {
            userInfo:{},
            userBankInfo:{},
            account:{},
            userData:{},
            group:{},
            userForm: {
                name: '',
                cellphone: '',
                company: '',
                department: ''
            },
            editRechargeForm:{
                money:0
            },
            editWithdrawalsForm:{
                money:0
            },
            ye:'10000',
            data3: ['建设银行', '农业银行', '中国银行', '人民银行', '工商银行', '交通银行'],
            editRefillModal:false,
            editWithdrawalsModal:false,
            editLoginPaw: false,
            editFundPaw: false,
            editBank: false,
            save_loading: false,
            editPasswordModal: false, // 修改密码模态框显示
            savePassLoading: false,
            oldPassError: '',
            oldBankError: '',
            oldCBankError: '',
            editFundPawForm:{
                oldPass: '',
                newPass: '',
                reFundPass: ''
            },
            editLoginPawForm: {
                oldPass: '',
                newPass: '',
                reLoginPass: ''
            },
            editBankForm: {
                bankName: '',
                bankAccount: '',
                userName: '',
                fundPaw:'',
            },
            createBankForm: {
                bankName: '',
                bankAccount: '',
                userName: '',
                fundPaw:'',
                reFundPaw:''
            },
            validate: {
                reLoginPass: [
                    { required: true, message: '请再次输入新密码', trigger: 'blur' },
                    { validator: valideRePassword, trigger: 'blur' }
                ],
                bankName: [
                    { required: true, message: '请输入银行名称', trigger: 'blur' }
                ],
                bankAccount: [
                    { required: true, message: '请输入银行账号', trigger: 'blur' },
                ],
                userName: [
                    { required: true, message: '请输入开户名', trigger: 'blur' },
                ],
                fundPaw: [
                    { required: true, message: '请输入资金密码', trigger: 'blur' },
                ],
                reFundPaw: [
                    { required: true, message: '请再次输入新密码', trigger: 'blur' },
                    { validator: valideCReFundPassword, trigger: 'blur' }
                ],
                oldPass: [
                    { required: true, message: '请输入原密码', trigger: 'blur' }
                ],
                newPass: [
                    { required: true, message: '请输入新密码', trigger: 'blur' },
                    { min: 6, message: '请至少输入6个字符', trigger: 'blur' },
                    { max: 32, message: '最多输入32个字符', trigger: 'blur' }
                ],
                reFundPass: [
                    { required: true, message: '请再次输入新密码', trigger: 'blur' },
                    { validator: valideReFundPassword, trigger: 'blur' }
                ]
            }
        };
    },
    methods: {
        withdrawals () {
            this.editWithdrawalsModal=true
        },
        cancelWithdrawals () {
            this.editWithdrawalsForm.money=0
            this.editWithdrawalsModal=false
        },
        refillModal () {
            this.editRefillModal=true
        },
        cancelRefill () {
            this.editRechargeForm.money=0
            this.editRefillModal=false
        },
        selectBank(value){
            this.$refs.bankName.$refs.input.focus()
        },
        selectBank2(value){
            this.$refs.bankName2.$refs.input.focus()
        },
        filterMethod (value, option) {
            return option.toUpperCase().indexOf(value.toUpperCase()) !== -1;
        },
        handleEditLogin () {
            this.editLoginPaw = !this.editLoginPaw;
        },
        handleEditFund () {
            this.editFundPaw = !this.editFundPaw;
        },
        handleEditBank () {
            this.editBank = !this.editBank;
        },
        cancelEditLogin () {
            this.editLoginPaw = false;
            this.$refs['editLoginPawForm'].resetFields()
        },
        cancelEditFund () {
            this.editFundPaw = false;
            this.$refs['editFundPawForm'].resetFields()
        },
        cancelEditBank () {
            this.editBank = false;
        },
        czBank(){
            this.$refs['createBankForm'].resetFields()
        },
        userUP(){
            let arr=this.userData.upers.split(">");
            return arr[arr.length-2]
        },
        exportImage () {
            let vm = this;
            let table = this.$refs.table2image.$el;
            /* 这部分代码用来解决生成的图片不清晰的问题 */
            // let tableWidth = table.offsetWidth;
            // let tableHeight = table.offsetHeight;
            // let canvas = document.createElement('canvas');
            // canvas.width = tableWidth * 2;
            // canvas.height = tableHeight * 2;
            // canvas.style.width = tableWidth + 'px';
            // canvas.style.height = tableHeight + 'px';
            // document.body.appendChild(canvas);
            // var context = canvas.getContext('2d');
            // context.scale(2, 2);
            /* 这部分代码用来解决生成的图片不清晰的问题 */
            html2canvas(table, {
                // canvas: canvas,
                onrendered (image) {
                    var url = image.toDataURL();
                    // document.getElementById('exportedImage').src = url;
                    let a = document.createElement('a');
                    a.href = url;
                    a.download = vm.imageName ? vm.imageName : '未命名';
                    document.body.appendChild(a);
                    a.click();
                    document.body.removeChild(a);
                    // document.body.removeChild(canvas);
                }
            });
        },
        showEditPassword () {
            this.editPasswordModal = true;
        },
        cancelEditUserInfor () {
            this.$store.commit('removeTag', 'ownspace_index');
            sessionStorage.pageOpenedList = JSON.stringify(this.$store.state.app.pageOpenedList);
            let lastPageName = '';
            if (this.$store.state.app.pageOpenedList.length > 1) {
                lastPageName = this.$store.state.app.pageOpenedList[1].name;
            } else {
                lastPageName = this.$store.state.app.pageOpenedList[0].name;
            }
            this.$router.push({
                name: lastPageName
            });
        },
        saveEditLoginPass () {
            let _this=this
            let data={
                NewPwd:this.editLoginPawForm.reLoginPass,
                OldPwd:this.editLoginPawForm.oldPass
            }
            
            this.$refs['editLoginPawForm'].validate((valid) => {
                if (valid) {
                    // 
                    this.savePassLoading = true;
                    this.$api.resetLoginPwd(data).then(response=>{
                        response.json().then(responseJson=> {
                            if(responseJson.success==true){
                                this.$Notice.success({
                                    title: '修改密码成功',
                                });
                                this.editLoginPaw = false;
                                this.$refs['editLoginPawForm'].resetFields()
                                // _this.editPasswordModal = false;
                            }else{
                                this.$Notice.error({
                                    title: '修改失败',
                                    desc: responseJson.error
                                });
                                if(responseJson.error=="原始密码错误"){
                                    this.editLoginPawForm.oldPass=''
                                    this.$refs['editLoginPawForm'].validateField('oldPass',() => {

                                    })
                                }
                            }
                            this.savePassLoading = false;
                        })
                    })
                    
                    // you can write ajax request here
                }
            });
        },
        saveEditFundPass () {
            let _this=this
            let data={
                old_pwd:this.editFundPawForm.oldPass,
                pwd:this.editFundPawForm.reFundPass,
                id:this.userBankInfo.id,
                version:this.userBankInfo.version
            }

            this.$refs['editFundPawForm'].validate((valid) => {
                if (valid) {
                    // 
                    this.savePassLoading = true;
                    this.$api.setBankInfo(data).then(response=>{
                        response.json().then(responseJson=> {
                            if(responseJson.success==true){
                                this.setBankInfo(responseJson.data)
                                this.$Notice.success({
                                    title: '设置成功',
                                });
                                this.editLoginPaw = false;
                                this.$refs['editFundPawForm'].resetFields()                      
                            }else{
                                this.$Notice.error({
                                    title: '设置失败',
                                    desc: responseJson.error
                                });
                                if(responseJson.error=="资金密码错误"){
                                    this.editFundPawForm.oldPass=''
                                    this.$refs['editFundPawForm'].validateField('oldPass',() => {

                                    })
                                }
                            }
                            this.savePassLoading = false;
                        })
                    })
                    
                    // you can write ajax request here
                }
            });
        },
        saveEditBank () {
            let _this=this
            let data={
                bank_name:this.editBankForm.bankName,
                bank_account:this.editBankForm.bankAccount,
                bank_user_name:this.editBankForm.userName,
                old_pwd:this.editBankForm.fundPaw,
                id:this.userBankInfo.id,
                version:this.userBankInfo.version
            }
            this.$refs['editBankForm'].validate((valid) => {
                if (valid) {
                    this.$api.setBankInfo(data).then(response=>{
                        response.json().then(responseJson=> {
                            if(responseJson.success==true){
                                this.setBankInfo(responseJson.data)
                                this.$Notice.success({
                                    title: '银行信息修改成功',
                                });
                                this.editBank = false;
                                // _this.editPasswordModal = false;
                            }else{
                                this.$Notice.error({
                                    title: '修改失败',
                                    desc: responseJson.error
                                });
                                if(responseJson.error=="资金密码错误"){
                                    this.editBankForm.fundPaw=''
                                    this.$refs['editBankForm'].validateField('fundPaw',() => {
                                    })
                                }
                            }
                            this.savePassLoading = false;
                        })
                    })
                }
                this.savePassLoading = true;
            });
        },
        saveCreateBank () {
            let _this=this
            let data={
                bank_name:this.createBankForm.bankName,
                bank_account:this.createBankForm.bankAccount,
                bank_user_name:this.createBankForm.userName,
                pwd:this.createBankForm.fundPaw,
            }
            
            this.$refs['createBankForm'].validate((valid) => {
                if (valid) {
                    this.$api.addBankInfo(data).then(response=>{
                        response.json().then(responseJson=> {
                            if(responseJson.success==true){
                                this.setBankInfo(responseJson.data)
                                this.$Notice.success({
                                    title: '银行信息修改成功',
                                });
                                // _this.editPasswordModal = false;
                            }else{
                                this.$Notice.error({
                                    title: '修改失败',
                                    desc: responseJson.error
                                });
                            }
                            this.editBank = false;
                            this.savePassLoading = false;
                        })
                    })
                    this.savePassLoading = true;
                }
            });
        },
        saveRecharge () {
            let _this=this
            let data={
                ...this.editRechargeForm
            }
            
            
                    this.$api.recharge(data).then(response=>{
                        response.json().then(responseJson=> {
                            if(responseJson.success==true){
                                this.$Notice.success({
                                    title: '充值请求发送成功',
                                });
                                this.editRechargeForm.money=0
                                this.editRefillModal=false
                            }else{
                                this.$Notice.error({
                                    title: '充值失败',
                                    desc: responseJson.error
                                });
                                if(responseJson.error=="资金密码错误"){
                                    this.editRechargeForm.money=0
                                }
                            }
                        })
                    })
        },
        saveWithdrawals () {
            let _this=this
            let data={
                ...this.editWithdrawalsForm
            }
            this.$api.withdraw(data).then(response=>{
                response.json().then(responseJson=> {
                    if(responseJson.success==true){
                        this.$Notice.success({
                            title: '提现请求发送成功',
                        });
                        this.editWithdrawalsForm.money=0
                        this.userInfo.Balance=responseJson.data.this_balance
                        
                        this.editWithdrawalsModal=false
                    }else{
                        this.$Notice.error({
                            title: '提现失败',
                            desc: responseJson.error
                        });
                        if(responseJson.error=="资金密码错误"){
                            this.editWithdrawalsForm.money=0
                        }
                    }
                    
                })
            })
        },
        setBankInfo(data){
            this.$api.getUserInfo().then(response=>{
                response.json().then(responseJson=> {
                    if(responseJson.success==true){
                        this.userInfo=responseJson.data
                        
                    }else{
                        this.$Notice.error({
                            title: '账户资金获取失败，可能是网络故障。。',
                            desc: responseJson.error
                        });
                    }
                })
            })
            let u=JSON.parse(sessionStorage.user)
            let group = JSON.parse(sessionStorage.group)
            
            for(let i = 0 ;i < group.length ;i++){
                if(group[i].level==u.user_data.User.group_level){
                    this.group=group[i]
                }
            }
            if(data){
                u.user_data.Bank=data
                sessionStorage.user=JSON.stringify(u)
            }
            this.userBankInfo=u.user_data.Bank
            this.account=u.user_data.Account
            this.userData=u.user_data.User
            
            this.editBankForm.bankName=u.user_data.Bank.bank_name
            this.editBankForm.bankAccount=u.user_data.Bank.bank_account
            this.editBankForm.userName=u.user_data.Bank.bank_user_name
        },
        init () {
            this.setBankInfo()
        }
    },
    mounted () {
        this.init();
    }
};
</script>
